import LazyImage from "@/components/base/LazyImage"
import styled from "@emotion/styled"
import { Link } from "react-router-dom"
import { TypeGameBrandItem } from "@/apis/home_page_constant_types"

const Container = styled(Link)`
    // width: 113rem;
    width: 100%;
    height: 56rem;
    border-radius: 10rem;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
`
interface Props extends TypeGameBrandItem {
    to: string
}

export const ProviderItem = (props: Props) => {
    return (
        <Container
            to={props.to}
            children={
                <LazyImage
                    width={"97rem"}
                    height={"40rem"}
                    src={props.icon || ""}
                />
            }
        />
    )
}
